<template lang="">
	<div class="myhomeinfo-wrap">
		<mine-header>{{ title }}</mine-header>
		<button class="publish" @click="publishAction">发布</button>
		<!-- 输入框 -->
		<div class="home-page">
			<div class="ipt">
				<input
					type="text"
					placeholder="搜索"
					class="iconfont icon-faxian:before"
				/>
			</div>
			<!-- 订单详情 -->
			<orderlist @click="checkinfo" />
		</div>
		<router-view></router-view>
	</div>
</template>
<script>
import MineHeader from '@/views/Mine/com/mine-header.vue';
import Orderlist from '../order/orderlist.vue';
export default {
	name: 'myhomeinfo',
	components: {
		[MineHeader.name]: MineHeader,
		[Orderlist.name]: Orderlist,
	},
	data() {
		return {
			title: '租房信息',
		};
	},
	methods: {
		publishAction() {
			//点击按钮，跳转到发布房源信息
			this.$router.push({
				name: 'hashandload',
			});
		},
		checkinfo() {
			////将事件传递给子组件，点击子组件时触发
			// console.log(111);
			this.$router.push({
				name: 'checkhomeinfo',
			});
		},
	},
};
</script>
<style lang="scss" scoped>
.myhomeinfo-wrap {
	width: 100%;
	height: 100%;
	background-color: #f4f6f9;
	position: absolute;
	top: 0;
	z-index: 9;
	.ipt {
		height: 30px;
		padding: 15px 0px;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		background-color: #f4f6f9;
		input {
			width: 90%;
			height: 100%;
			font-size: 16px;
		}
	}

	.publish {
		position: absolute;
		top: 15px;
		right: 20px;
		font-size: 16px;
		color: #4a73ff;
		border: none;
		background-color: #fff;
	}
}
</style>
